import React from 'react'

const App = () => {
  return (
    <div>
      {/* 
    项目 TS 解析
    对于 interface 的解析：
      如果在父组件中传入 children，则需要在这里加入 children 项，在本组件通过 props.children 就可以使用
      由于传过来的 children 可能是字符串，也有可能的元素，所以类型标注为：ReactNode
      注意引入最好单独将类型在以这种方式引入： import type { ReactNode } from 'react'

      如果是联合类型，比如设置方位'left'，可以自动监测为 string 类型，但是有时候不一定只有 left，可以设置为 ： derection: 'left' | 'right'
      如果想设置为任意类型的数组，而不只是将一个单纯的空数组作为初始值，因为空数组会自动检测为 never[] , 可以设置为 any[] 即可

    案例：
    interface IData {
      children?: ReactNode,

      derection: 'left' | 'right' | 'up' | 'down',
      arr: any[],
      arrStr: string[], // 表示字符串类型数组
    }

    表示任意类型的对象
    const [name,setName] = useState<
      Record<string, unknown>
    >({});
    
    Record<string, never> 空对象

    初始状态为null时候，需要显示声明类型：
    type User = {name:string}
    const [user, setUser] = React.useState<User | null>(null)

    当使用 Ref 绑定组件的时候，普通的 标签不需要定义类型，但是如果是组件就需要定义类型
    1、先引入：import type { ElementRef } from 'react' 、和 import { useRef } from 'react'
    2、const ref名字 = useRef<ElementRef<typeof 组件名>>()
    注意：
    如果初始并没有定义值，则需要定义为 null：
    const ref名字 = useRef<ElementRef<typeof 组件名>>(null)

    */}
    </div>
  )
}

export default App
